<div data-role="page" id="commentDialog" data-dialog="true">
<div data-role="header">
<h2><?php echo Yii::t('site', 'Review'); ?></h2>
</div>
<div class="ui-content" role="main">
<form id="ajaxCommentForm">
<input type="hidden" name="comment_type" value="BSResourceGroup" />
<div data-role="fieldcontain">
    <div class="ui-btn-inline"><?php echo Yii::t('site', 'Rating'); ?></div>
    <div id="commentStar" data-score="3" class="ui-btn-inline"></div>
</div>
<div data-role="fieldcontain">
    <label for="comment_name"><?php echo Yii::t('site', 'Title'); ?></label>
    <input type="text" name="comment_name"></input>
</div>
<div data-role="fieldcontain">
    <label for="comment_content"><?php echo Yii::t('site', 'Content'); ?></label>
    <textarea name="comment_content"></textarea>
</div>

<div class="ui-grid-a">
<div class="ui-block-a">
<a href="javascript:void(postComment())" class="ui-btn ui-btn-b ui-shadow ui-corner-all"><?php echo Yii::t('site', 'Save'); ?></a>
</div>
<div class="ui-block-b">
<a href="javascript:void(resetCommentAndBack())" class="ui-btn ui-shadow ui-corner-all"><?php echo Yii::t('site', 'Cancel'); ?></a>
</div>
</div>
</form> 
</div>
</div>
<script>
$('#commentDialog').on('pageshow', function () {
    $('#commentStar').raty({
        path: "<?php echo Yii::app()->request->baseUrl; ?>/images/",
        readOnly: false,
        halfShow : true,
        score: function() {
            return $(this).attr('data-score');
        }
    });
});

function resetCommentAndBack() {
    $("#ajaxCommentForm input[name='comment_name']").val("");
    $("#ajaxCommentForm textarea[name='comment_content']").val("");
    
    $.mobile.back();
}

function postComment() {
    var formData = $('#ajaxCommentForm').serialize();
    resetCommentAndBack();
    
    $.ajax({ 
        type : "POST", 
        url  : "<?php echo $this->createUrl('addComment', array('id'=>$id)); ?>",  
        cache : false,
        data : formData, 
        beforeSend: function() { $.mobile.loading( 'show' ) }, //Show spinner
        complete: function() { $.mobile.loading( 'hide' ) }, //Hide spinner
        success : onCommentSuccess, 
        error : onCommentError 
    }); 
}

function onCommentSuccess(data, status) {
    var info = JSON.parse(data);
    $('#star').attr("data-score", info.rating);
    $('#commentCount').html(info.count);
    $('#star').raty({
        path: "<?php echo Yii::app()->request->baseUrl; ?>/images/",
        readOnly: true,
        halfShow : true,
        score: function() {
            return $(this).attr('data-score');
        }
    });
} 
 
function onCommentError(data, status) { 
    alert("<?php echo Yii::t('site', 'Error'); ?>: " + data);
} 
</script>